<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>菜单列表 - 我的后台</title>
	<meta name="renderer" content="webkit">
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
	<meta name="apple-mobile-web-app-status-bar-style" content="black">
	<meta name="apple-mobile-web-app-capable" content="yes">
	<meta name="format-detection" content="telephone=no">
	<link rel="stylesheet" href="__STATIC__/layui/css/layui.css" media="all" />
	<link rel="stylesheet" href="__CSS__/news.css" media="all" />
</head>
<body class="childrenBody">
	<blockquote class="layui-elem-quote news_search">
		<div class="layui-inline">
			<div class="layui-form">
				<label class="layui-form-label">父级菜单</label>
				<div class="layui-input-block">
					<select name="pid" id="search" lay-verify="search" lay-search>
						{volist name="parent" id="vo"}
					  		<option value="{$vo.nav_id}">{$vo.name}</option>
						{/volist}
					</select>
				</div>
			</div>
		</div>
		<div class="layui-inline">
			<a class="layui-btn" id="search-btn" data-type="reload" href="javascript:;">搜索</a>
		</div>
		<div class="layui-inline">
			<a class="layui-btn layui-btn-normal newsAdd_btn" href="{:url('admin/menu/edit', ['flag' => 'add'])}">添加菜单</a>
		</div>

		<div class="layui-inline">
			<a class="layui-btn layui-btn-danger batchDel">批量删除</a>
		</div>
	</blockquote>
	<div class="layui-form news_list">
		<table class="layui-hide" id="demo" lay-filter="demo"></table>
	</div>
	<script type="text/html" id="level">
		{{#  if(d.level == 0){ }}
			<span>首页</span>
		{{#  } else if(d.level == 1) { }}
			<span>一级</span>
		{{#  } else if(d.level == 2) { }}
			<span>二级</span>
		{{#  } }}
	</script>

	<script type="text/html" id="isshow">
		{{#  if(d.show == -1){ }}
			<span><i class="layui-icon" style="font-size: 24px;color: #f00">&#x1006;</i></span>
		{{#  } else if(d.show == 1) { }}
			<span><i class="layui-icon" style="font-size: 24px;color: #1CB116">&#xe605;</i></span>
		{{#  } }}
	</script>

	<script type="text/html" id="inright">
		{{#  if(d.inright == -1){ }}
			<span><i class="layui-icon" style="font-size: 24px;color: #f00">&#x1006;</i></span>
		{{#  } else if(d.inright == 1) { }}
			<span><i class="layui-icon" style="font-size: 24px;color: #1CB116">&#xe605;</i></span>
		{{#  } }}
	</script>

	<script type="text/html" id="barDemo">
		<a class="layui-btn layui-btn-xs" title="查看" lay-event="detail">
			<i class="layui-icon">&#xe615;</i>
		</a>
		<a class="layui-btn layui-btn-xs layui-btn-normal" title="编辑" lay-event="edit">
			<i class="layui-icon">&#xe642;</i>
		</a>
		<a class="layui-btn layui-btn-xs layui-btn-danger" title="删除" lay-event="del">
			<i class="layui-icon">&#xe640;</i>
		</a>
	</script>

	<script type="text/javascript" src="__STATIC__/layui/layui.js"></script>
	<script type="text/javascript">
		
		layui.use(['form', 'layer', 'table'],function(){
			var form  = layui.form,
				layer = layui.layer,
				table = layui.table,
				$ = layui.$;

				layer.msg("加载中...", {'time':1000});

				table.render({
					elem: '#demo'
					,page:true
					,url:'/admin/menu/index?type=1'
					,cellMinWidth: 80 //全局定义常规单元格的最小宽度，layui 2.2.1 新增
					,cols: [[
						{type:'checkbox', fixed: 'left'}
						,{field:'nav_id', title: 'ID', width:100, sort: true}
						,{field:'name', title: '菜单名称', width:200}
						,{field:'link', title: '地址', width:250}
						,{field:'parent', title: '父级菜单', width:200}
						,{field:'level', title: '菜单等级', width: 150, sort: true, templet:"#level"}
						,{field:'ordernum', title: '排序', width: 80, sort: true}
						,{field:'show', title: '前台显示', width: 100, sort: true, templet:"#isshow"}
						,{field:'inright', title: '权限控制', width: 100, sort: true, templet:"#inright"}
						,{field:'update_time', title: '修改时间', width: 150, sort: true}
						,{fixed:'right', title: '操作',toolbar:"#barDemo", minWidth: 180}
					]]
				});	

		        //搜索
		        var active = {
		            reload: function(){
		                table.reload('demo', {
		                    page: {
		                        curr: 1 //重新从第 1 页开始
		                    },
		                    where: {
		                        pid: $('#search').val()
		                    }
		                });
		            }
		        };

		        $('.news_search #search-btn').on('click', function(){
		            var type = $(this).data('type');
		            active[type] ? active[type].call(this) : '';
		        });

		        //监听工具条
		        table.on('tool(demo)', function(obj){
		            var data     = obj.data,
		                layEvent = obj.event;
		            if(layEvent === 'detail') {

		            	layer.msg("查看操作");
		            } else if(layEvent === 'edit'){

		                window.location.href= '/admin/menu/edit?nav_id=' + data.nav_id + "&flag=edit";
		            }else if(layEvent === 'del'){
		                layer.confirm('确定删除？', function (index) {
		                    //向服务端发送删除指令
		                    var nav_id = data.nav_id;
		                    $.ajax({
		                        url: "/admin/menu/delmenu",
		                        type: "POST",
		                        data: {"nav_id": data.nav_id},
		                        dataType: "json",
		                        success: function (data) {
		                            if (data.status == '1') {
		                                //删除这一行
		                                obj.del();
		                                //关闭弹框
		                                layer.close(index);
		                                layer.msg(data.msg, {icon: 6});
		                            } else {
		                                layer.msg(data.msg, {icon: 5});
		                            }
		                        }
		                    });
		                });
		            }
		        });

		        $('.batchDel').click(function(){
					var checkStatus = table.checkStatus('demo');
					var data = checkStatus.data;
					var arr  = new Array();
					for (var i = 0; i < data.length; i++) {
						arr.push(data[i].nav_id);
					}

	                layer.confirm('确定删除？', function (index) {
	                    //向服务端发送删除指令
	                    $.ajax({
	                        url: "/admin/menu/delmenu",
	                        type: "POST",
	                        data: {"ids": JSON.stringify(arr)},
	                        dataType: "json",
	                        success: function (data) {
	                            if (data.status == '1') {
	                                layer.msg(data.msg, {icon: 6}, function(){
	                            		location.reload();
	                                });
	                            } else {
	                                layer.alert(data.msg, {icon: 5});
	                            }
	                        }
	                    });
	                });
		        })

		})	
	</script>
</body>
</html>